﻿@*
    For more information on enabling MVC for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860
*@
@{
    Layout = null;
}
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Demo</title>
    <!-- 请勿在项目正式环境中引用该 layui.css 地址 -->
    <link href="//unpkg.com/layui@2.11.0/dist/css/layui.css" rel="stylesheet">
    <!-- 引入 jQuery 库 -->
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>

<body>
    <form class="layui-form" id="permissionForm" action="">
        <div class="layui-form-item">
            <label class="layui-form-label">科室名称</label>
            <div class="layui-input-block" style="width:300px">
                <input type="text" name="deparName" id="deparName" lay-verify="required" placeholder="请输入" autocomplete="off"
                       class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">所属院区</label>
            <div class="layui-input-block" style="width:300px">
                <select name="campusId" id="campusId">
                    <option value="0">请选择</option>
                </select>
            </div>
        </div>


        <div class="layui-form-item">
            <label class="layui-form-label">上级科室</label>
            <div class="layui-input-block" style="width:300px">
                <select name="superAffiliation" id="superAffiliation" lay-filter="superAffiliation">
                    <option value="0">请选择</option>
                </select>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">科室位置</label>
            <div class="layui-input-block" style="width:300px">
                <input type="text" name="doctorlocation" id="doctorlocation" lay-verify="required" placeholder="请输入"
                       autocomplete="off" class="layui-input">
            </div>
        </div>


        <div class="layui-form-item" pane>
            <label class="layui-form-label">科室状态</label>
            <div class="layui-input-block">
                <input type="checkbox" name="deparstate" id="deparstate" lay-skin="switch" lay-filter="switchTest">
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-input-block">
                <button type="submit" class="layui-btn" lay-submit lay-filter="addPermission">立即提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>

    <!-- 请勿在项目正式环境中引用该 layui.js 地址 -->
    <script src="//unpkg.com/layui@2.11.0/dist/layui.js"></script>
    <script>
        layui.use(['form', 'layer'], function () {
            var form = layui.form;
            var layer = layui.layer;

            // 加载科室数据的函数
            function loadDepartments(parentId, selector) {
                $.ajax({
                    url: `@ViewBag.BaseUrl/T5/Department/CascadeDepartment?parentId=${parentId || ''}`,
                    success: function (res) {
                        var $select = $(selector);
                        $select.find('option:not(:first)').remove();
                        res.data.forEach(item => {
                            $select.append(`<option value="${item.deparId}">${item.deparName}</option>`);
                        });
                        form.render('select');
                    },
                    error: function (jqXHR, textStatus, errorThrown) {
                        layer.msg(`加载科室数据出错: ${textStatus} - ${errorThrown}`);
                        console.error('加载科室数据出错:', jqXHR, textStatus, errorThrown);
                    }
                });
            }

            // 加载所属院区数据的函数
            function loadCampuses(pageIndex = 1, pageSize = 50) {
                $.ajax({
                    url: `@ViewBag.BaseUrl/T5/HospitalNavigation/GetHospitalNavigation?PageIndex=${pageIndex}&PageSize=${pageSize}`,
                    success: function (res) {
                        var $select = $('#campusId');
                        $select.find('option:not(:first)').remove();
                        res.data.forEach(item => {
                            $select.append(`<option value="${item.hospitalNavigationId}">${item.campusName}</option>`);
                        });
                        form.render('select');
                    },
                    error: function (jqXHR, textStatus, errorThrown) {
                        layer.msg(`加载所属院区数据出错: ${textStatus} - ${errorThrown}`);
                        console.error('加载所属院区数据出错:', jqXHR, textStatus, errorThrown);
                    }
                });
            }

            // 页面加载时加载所属院区和上级科室选项
            loadCampuses();
            loadDepartments(null, '#superAffiliation');

            form.on('submit(addPermission)', function (data) {
                // 创建 FormData 对象
                var pdata = {
                    deparName: $("#deparName").val(),
                    campusId: $("#campusId").val(),
                    superAffiliation: $("#superAffiliation").val(),
                    doctorlocation: $("#doctorlocation").val(),
                    deparstate: $("#deparstate").prop('checked')
                };

                // 打印要发送的数据
                console.log('发送的数据:', pdata);

                // 发送 Ajax 请求
                $.ajax({
                    url: '@ViewBag.BaseUrl/T6/Department/AddDepartment',
                    data: JSON.stringify(pdata),
                    type: 'post',
                    dataType: 'json',
                    contentType: 'application/json',
                    success: function (res) {
                        if (res.code === 100) {
                            layer.msg('添加成功');
                            $('#permissionForm')[0].reset();
                     
                        } else {
                            layer.msg(res.msg);
                        }
                    },
                    error: function (jqXHR, textStatus, errorThrown) {
                        layer.msg(`请求出错: ${textStatus} - ${errorThrown}`);
                        console.error('请求出错:', jqXHR, textStatus, errorThrown);
                    }
                });

                return false;
            });
        });
    </script>
    <style>
        .layui-form-select option {
            white-space: pre; /* 保留空格 */
            font-family: monospace; /* 等宽字体使缩进对齐 */
        }
    </style>
</body>

</html>    